<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>

<div id="testElement"></div>
<div id="secondElement"></div>

<script>

// This set of tests looks at properties that are not yet supported
// by the typed OM. It will probably need to be updated as we start
// supporting some of these properties.

test(function() {
  testElement.style.backgroundColor = '#00FF00';

  var result = testElement.attributeStyleMap.get('background-color');
  assert_equals(result.constructor, CSSStyleValue);
  assert_equals(result.toString(), 'rgb(0, 255, 0)');
}, 'Unsupported property returns a base StyleValue with the correct toString().');

test(function() {
  testElement.style.backgroundColor = '#00FF00';

  secondElement.attributeStyleMap.set('background-color', testElement.attributeStyleMap.get('background-color'));

  var result = secondElement.attributeStyleMap.get('background-color');
  assert_equals(result.constructor, CSSStyleValue);
  assert_equals(result.toString(), 'rgb(0, 255, 0)');
}, 'Setting the same property using the result of getting an unknown value works');

test(function() {
  testElement.style.color = '#00FF00';

  assert_throws_js(TypeError, () => {
    secondElement.attributeStyleMap.set('border-left-color', testElement.attributeStyleMap.get('color'));
  });

}, 'Setting a different property using the result of getting an unknown value throws TypeError');

</script>
